﻿@{
	Layout = null;
}

<link href="~/libs/layui-v2.9.21/layui-v2.9.21/layui/css/layui.css" rel="stylesheet" />
<link href="~/libs/layui-v2.9.21/layui-v2.9.21/layui/module/treetable-lay/treetable.css" rel="stylesheet" />

<div>
	<div class="layui-inline">
		<div class="layui-input-group">
			<div class="layui-input-split layui-input-prefix">
				分类名称
			</div>
			<input type="text" placeholder="请输入分类名称" id="materialTypeName" class="layui-input">
		</div>
	</div>
	<div class="layui-inline">
		<button class="layui-btn" id="btn-search">查询</button>
		<button class="layui-btn" id="btn-expand">全部展开</button>
		<button class="layui-btn" id="btn-fold">全部折叠</button>
		<button class="layui-btn" id="btn-refresh">刷新表格</button>
	</div>
</div>



<table id="table1" class="layui-table" lay-filter="table1"></table>

<!-- 操作列 -->
<script type="text/html" id="oper-col">
	<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="add">新增</a>
	<a class="layui-btn layui-btn-info layui-btn-xs" lay-event="edit">修改</a>
	<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script src="~/libs/jquery/jquery.js"></script>
<script src="~/libs/layui-v2.9.21/layui-v2.9.21/layui/layui.js"></script>
<script src="~/libs/layui-v2.9.21/layui-v2.9.21/layui/module/treetable-lay/treetable.js"></script>

<script>
	 layui.use(['layer', 'table', 'treetable'], function () {
		 var $ = layui.jquery;
		 var table = layui.table;
		 var layer = layui.layer;
		 var treetable = layui.treetable;

	  // 渲染表格
		 var renderTable = function () {
			 layer.load(2);
			 treetable.render({
				 treeColIndex: 1,
				 treeSpid: 0,
				 treeIdName: 'id',
				 treePidName: 'orderBy',
				 treeDefaultClose: false,
				 treeLinkage: false,
				 elem: '#table1',
				 url: '/MaterialType/SelectPublicCode',
				 where:{
				 materialTypeName:$("#materialTypeName").val()||""
				 },
				 page: false,
				 cols: [[
					 { type: 'numbers' },
					 { field: 'materialTypeName', title: '分类名称'},
				 //	{ field: 'orderBy', title: '排序' },
					 { field: 'products', title: '物料/产品' },
					 { field: 'orderBy', title: '父级Id' },
					 { field: 'state', title: '状态' ,
					 templet:function (row){
					 return	row.state==true?'启用':'禁用'
					 }},
					 { templet: '#oper-col', title: '操作列' }
				 ]],
				 done: function () {
					 layer.closeAll('loading');
				 }
			 });
		 };



	   renderTable();

	 

		 $("#btn-search").on("click", function () {
			 renderTable();
		 })

		 $('#btn-expand').click(function () {
			 treetable.expandAll('#table1');
		 });

		 $('#btn-fold').click(function () {
			 treetable.foldAll('#table1');
		 });

		 $('#btn-refresh').click(function () {
			 renderTable();
		 });


	//监听工具条
			 table.on('tool(table1)', function (obj) {
				 var data = obj.data;
				 var layEvent = obj.event;
				 //console.log(data);

				 if (layEvent === 'del') {
					 layer.confirm('确定要删除吗？', function (index) {
						 // 获取当前行数据
						 var data = obj.data;

						 $.ajax({
							 url: '/MaterialProductsType/DeleteMaterialProductsType?id=' + data.id,
							 type: 'post',
							 success: function (res) {
								 if (res.code === 0) {
									 layer.msg("删除成功！", { icon: 6, time: 1500 });
									 renderTable();
								 } else {
									 layer.msg(res.msg, { icon: 2 });
								 }
							 }
						 })

						 layer.close(index); // 关闭确认框
					 });


				 }
				 else if (layEvent === 'add')
				 {
					 layer.open({
						 title: '添加物料分类',
						 type: 2,
						 area: ['700px', '515px'],
						 offset: ['50px', '50px'],
						 content: ['/MaterialType/Add?orderBy=' + data.id],
					 });
				 }
				 else if (layEvent === 'edit') {
					 layer.open({
						 title: '修改物料分类',
						 type: 2,
						 area: ['900px', '615px'],
						 offset: ['50px', '50px'],
						 content: ['/MaterialProductsType/UpdateMaterialProductsType?id=' + data.id],
					 });
				 }
			 });






	 });




</script>